import React, { Component } from 'react';
import { Animated, Text } from "react-native";
import View = Animated.View;

class Blink extends Component<{
    text: string
}, {
    showText: boolean
}> {
    state = {
        showText: true
    };

    componentDidMount() {
        setInterval(() => {
            this.setState(previousState => {
                return {
                    showText: !previousState.showText
                }
            })
        }, 1000)
    }

    render() {
        const display = this.state.showText ? this.props.text : ' ';
        return (
            <Text>{display}</Text>
        )
    }
}

export default class BlinkApp extends Component {
    render() {
        return (
            <View>
                <Blink text={'xusheng'}/>
                <Blink text={'fangling'}/>
            </View>
        )
    }
}